<template>
  <lay-layout class="examples">
    <lay-header>
      <!--导航栏-->
      <div class="exnavigationbar">
        <Navigationbar/>
      </div>
    </lay-header>
    <lay-backtop></lay-backtop>
    <lay-body>
      <div class="content-center">
        <!--商家信息-->
        <business/>
        <!--商品信息-->
        <commodity/>
      </div>
    </lay-body>
  </lay-layout>
</template>

<script setup>
import "./detailed.css"
import { useRoute } from "vue-router";

import {ref, watch} from "vue";
import Navigationbar from "@/components/homepage/Navigationbar/Navigationbar.vue";
import Business from "@/components/detailed/business/business.vue";
import Commodity from "@/components/detailed/commodity/commodity.vue";

const route = useRoute();

// 用于控制组件的 key
const componentKey = ref(Date.now()); // 每次切换页面时，生成一个新的 key

// 监听路由变化，更新 key 来强制重新渲染组件
watch(route, () => {
  componentKey.value = Date.now();
});
</script>
